﻿@model LanusMarket.Models.Ubicacion

<h2>@ViewBag.Action  @ViewBag.Entity</h2>

<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>

<fieldset>
    <legend>Ubicacion</legend>
    <div style="float:left;">
        <div class="display-label">Titulo</div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Titulo)
        </div>

        <div class="display-label">Descripcion</div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Descripcion)
        </div>  

        <div class="display-label">Email</div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Email)
        </div>

        <div class="display-label">Telefono</div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Telefono)
        </div>

        <div class="display-label">Link</div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Link)
        </div>

        <div class="display-label">Latitud</div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Latitud)
            @Html.HiddenFor(model => model.Latitud)
        </div>

        <div class="display-label">Longitud</div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Longitud)
            @Html.HiddenFor(model => model.Longitud)
        </div>   

        <div class="display-label">Keys</div>
        <div class="display-field">
            @Html.DisplayFor(model => model.SearchKeys)
        </div>

    </div>
    <div id="Maps" style="float:left;margin-left:25px;">          
            <div style="margin-bottom:10px;">
                <div style="float:left;margin-right:25px;" >
                   <div class="display-label">Pais</div>
                    <div class="display-field">
                        @Html.DisplayFor(model => model.Pais)
                    </div>
                    <div class="display-label">Provincia</div>
                    <div class="display-field">
                        @Html.DisplayFor(model => model.Provincia)
                    </div>
                    <div class="display-label">Localidad</div>
                    <div class="display-field">
                        @Html.DisplayFor(model => model.Localidad.Nombre)
                    </div>
                </div>
                <div style="float:left;">
                    <div class="display-label">Calle</div>
                    <div class="display-field">
                        @Html.DisplayFor(model => model.Calle)
                    </div>
                    <div class="display-label">Altura</div>
                    <div class="display-field">
                        @Html.DisplayFor(model => model.Altura)
                    </div>
                    <div class="display-label">CodigoPostal</div>
                    <div class="display-field">
                        @Html.DisplayFor(model => model.CodigoPostal)
                    </div>
                </div>
                <div style="clear:both;"></div> 
            </div>
            <div style="clear:both;"></div>
            <script type="text/javascript">
                $(document).ready(function () {                    
                    initialize();
                });

                var geocoder;
                var map;
                function initialize() {
                    geocoder = new google.maps.Geocoder();
                    var lat = $('#Latitud').val();
                    var lng = $('#Longitud').val();
                    var latlng = new google.maps.LatLng(lat, lng);
                    var myOptions = { zoom: 18, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }
                    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
                    var marker = new google.maps.Marker({
                        map: map,
                        position: latlng
                    });
                }                                

            </script>            
            <div id="map_canvas" style="width: 500px; height: 300px;"></div>            
        </div>
</fieldset>
<p>
    @Html.ActionLink("Editar", "Edit", new { id=Model.UbicacionID }) |
    @Html.ActionLink("Volver al listado", "Index")
</p>
